<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>


<html>
<head>
    <title>添加轮播图信息</title>
    <%@ include file="../../common/base.jsp" %>

    <script type="text/javascript">

        function addSubmit() {
            $("#typeZhu").html("");
            $("#types").hide();
            $("#typeZhu").hide();

            if (!verify_Number('isDesc','显示顺序')) {
                return false;
            }

            var type = $("#type").val();
            if(type == ""){
                $("#typeZhu").html("请选择轮播图的事件类型");
                $("#typeZhu").show();
                return false;
            }

            if(type == 1){
                if(!validateContentNotNull('linkUrl',1,60,'链接地址',true)){
                    return false;
                }
            }else if(type ==2){
                if(!validateContentNotNull('eventParam',1,60,'事件参数',true)){
                    return false;
                }
            }

            $.ajax({
                type: "POST",
                url: "${pageContext.request.contextPath}/carousel/saveCarousel",
                dataType: "json",
                data: getParams(),
                success: function (data) {
                    if (data.errorCode == 0) {
                        prompt.alert("添加轮播图成功！");

                        setTimeout(function () {
                            window.location.href = "${pageContext.request.contextPath}/carousel/showCarousel";
                        }, 2000);
                    } else {
                        prompt.alert(data.msg);
                    }
                }
            });
        }

        //获取form表单所有参数
        function getParams() {
            var json = {};
            var isDesc = $("#isDesc").val();
            json["isDesc"] = isDesc;
            var type = $("#type").val();
            json["type"] = type;
            var imageUrl = $("#imageUrl").val();
            json["imageUrl"] = imageUrl;
            if(type == 1){
                var linkUrl = $("#linkUrl").val();
                json["linkUrl"] = linkUrl;
            }else if(type == 2){
                var eventParam = $("#eventParam").val();
                json["eventParam"] = eventParam;
            }

            return json;
        }

        function fileImageChange(txt){
            $.ajaxFileUpload({
                //需要链接到服务器地址
                url:"carousel/saveCarouselFile",
                secureuri:false,
                fileElementId:"imageFile",           //文件选择框的id属性
                dataType: 'json',                             //返回值类型 一般设置为json
                success: function(data, status){
                    var obj = eval(data);
                    if(obj.errorCode == 0){
                        var fileName = obj.fileName;
                        $("#imageUrl").val(fileName);
                        prompt.alert("上传成功");
                        $("#a_value_1").text(txt);
                    }else{
                        prompt.alert("上传失败");
                    }
                },error: function (data, status, e){
                    prompt.alert("文件上传错误");
                }
            });
        }


        // 数字必填验证
        function verify_Number(id,thisName) {
            var val = $("#" + id).val();
                $("#" + id + "Zhu").html("");
                $("#" + id + "s").hide();
                $("#" + id + "Zhu").hide();
                //开始验证
                if (verifyEmpty(val)) {
                    if (thisName != '' && thisName != null) {
                        $("#" + id + "Zhu").html(thisName + "值不能为空！");
                    } else {
                        $("#" + id + "Zhu").html("该值不能为空！");
                    }
                    $("#" + id + "Zhu").show();
                    return false;
                } else {
                    //纯数字正则
                    var numReg = new RegExp("^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$");

                    if (!numReg.test(val)) {
                        if (thisName != '' && thisName != null) {
                            $("#" + id + "Zhu").html(thisName + "由数字组成！");
                        } else {
                            $("#" + id + "Zhu").html("该值由数字组成！");
                        }
                        $("#" + id + "Zhu").show();
                        return false;
                    }
                    $("#" + id + "s").show();
                    return true;
                }

        }

        function typeChange(){
            var type = $("#type").val();

            if(type == 1){
                $("#eventParamLi").hide();
                $("#linkUrlLi").show();
            }else if(type == 2){
                $("#eventParamLi").show();
                $("#linkUrlLi").hide();
            }else{
                $("#eventParamLi").hide();
                $("#linkUrlLi").hide();
            }

        }

    </script>

</head>

<body id="body">
<!--head-->
<div id="head">
    <jsp:include page="../../common/head.jsp"></jsp:include>
</div>
<!--head end-->
<!--container-->
<div id="container">
    <div id="pageId" style="display: none;">05-07-03</div>
    <!--sidebar-->
    <%@ include file="../../common/menu.jsp" %>
    <!--sidebar-->
    <!--main-->
    <div class="main" id="mainDiv">
        <div class="channel_manage">
            <div class="location" style="background-position:22px -29px;">
                平台管理<span>&gt;</span>APP首页配置<span>&gt;</span>轮播图管理<span>&gt;</span>添加轮播图
            </div>
            <form method="post" enctype="multipart/form-data">
                <!--content-->
                <div class="content">
                    <div class="inputInfoList3">
                        <ul class="recharge_list" style="width:600px;">
                            <li>
                                <label>显示顺序</label>
                                <input type="text" id="isDesc" name="isDesc"
                                       onFocus="this.style.border = '1px solid #2A7CCF'"
                                       onblur="verify_Number('isDesc','显示顺序');this.style.border = '1px solid #D5D5D5'"/>
                                <span style="position:absolute;left:76%;top:9px;color:red;" class="red">*</span>
                                <i style="display: none;background-position: left center;" id="isDescs" class="s_tips"></i>
                                <i style="display: none;background-position: left center;padding-left:28%;" id="isDescZhu" class="zhu_shi_2"></i>
                            </li>
                            <li>
                                <label>事件类型</label>
                                <select id="type" name="type" style="width: 310px;" onchange="typeChange()">
                                    <option value="">选择事件类型</option>
                                    <option value="1">链接</option>
                                    <option value="2">事件</option>
                                </select>
                                <span style="position:absolute;left:76%;top:9px;color:red;" class="red">*</span>
                                <i style="display: none;background-position: left center;" id="types" class="s_tips"></i>
                                <i style="display: none;background-position: left center;padding-left:28%;" id="typeZhu" class="zhu_shi_2"></i>
                            </li>
                            <li>
                                <label>轮播图</label>
                                <div class="file" style="width: 280px;">
                                    <input type="hidden" id="imageUrl" name="imageUrl" >
                                    <input type="file" id="imageFile" name="imageFile" onChange="fileImageChange(this.value)">
                                    <span id="a_value_1">选择轮播图片文件上传</span>
                                </div>
                            </li>
                            <li id="eventParamLi" style="display: none;">
                                <label>事件参数</label>
                                <input type="text" id="eventParam" name="eventParam"
                                        onFocus="this.style.border = '1px solid #2A7CCF'"
                                        onblur="validateContentNotNull('eventParam',1,60,'事件参数');this.style.border = '1px solid #D5D5D5'"/>
                                <span style="position:absolute;left:76%;top:9px;color:red;" class="red">*</span>
                                <i style="display: none;background-position: left center;" id="eventParams" class="s_tips"></i>
                                <i style="display: none;background-position: left center;padding-left:28%;" id="eventParamZhu" class="zhu_shi_2"></i>
                            </li>
                            <li id="linkUrlLi" style="display: none;">
                                <label>链接地址</label>
                                <input type="text" id="linkUrl" name="linkUrl"
                                       onFocus="this.style.border = '1px solid #2A7CCF'"
                                       onblur="validateContentNotNull('linkUrl',1,60,'链接地址');this.style.border = '1px solid #D5D5D5'"/>
                                <span style="position:absolute;left:76%;top:9px;color:red;" class="red">*</span>
                                <i style="display: none;background-position: left center;" id="linkUrls" class="s_tips"></i>
                                <i style="display: none;background-position: left center;padding-left:28%;" id="linkUrlZhu" class="zhu_shi_2"></i>
                            </li>
                        </ul>
                        <div class="button_wrap">
                            <a href="javascript:void(0);" onClick="addSubmit();" class="bg_green">完成</a>
                            <input type="reset" value="重置">
                        </div>
                    </div>
                </div>
                <!--content-->
            </form>
            <!--foot-->
            <%@ include file="../../common/foot.jsp" %>
            <!--foot-->
        </div>
    </div>
    <!--main-->
</div>
<script src="${pageContext.request.contextPath}/static/js/basic.js"></script>

</body>
</html>
